import React, { Component } from 'react';
import { WingBlank, WhiteSpace, Toast } from 'antd-mobile';
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
import ImgCarousel from 'common/components/imgCarousel.js';
import HomeNav from './sub/homeNav.js';
import HomeNavigate from './sub/homeNavigate.js';
import RecommendItem from 'common/components/recommendItem.js';
import * as userInfoActions from 'common/userinfo.js';
import * as homeApi from '../api/home.js';
import * as common from 'common/common.js';
import './home.less';

/**
 * 主页组件
 */
class Home extends Component{

	constructor(props) {
	    super(props);
	    this.state = {
	    	carouselImages: [
                {
                    imgUrl: 'assets/img/carousel_01.png',
                    linkUrl: 'http://www.baidu.com'
                },
                {
                    imgUrl: 'assets/img/carousel_02.png',
                    linkUrl: 'http://www.baidu.com'
                },
                {
                    imgUrl: 'assets/img/carousel_03.png',
                    linkUrl: 'http://www.baidu.com'
                }
            ],
            homeNavigates: [
				{
					icon: 'assets/img/navigate_1.png',
					text: '分类'
				},
				{
					icon: 'assets/img/navigate_2.png',
					text: '排行榜'
				},
				{
					icon: 'assets/img/navigate_3.png',
					text: '活动'
				},
				{
					icon: 'assets/img/navigate_4.png',
					text: '免费'
				}
			],
			recommendList: [] 
	    }
	}

	componentDidMount(){
		//取缓存
		if(common.cacheExists("cachRecommendList")){
			this.setState({
				recommendList: common.cacheGet("cachRecommendList")
			})
		}else{
			Toast.loading();
			//获取书籍推荐：出版精品
			homeApi.bookRecommend({
				id: "59128365e5a3262c37488e3d"
			}).then(result => {
				let recommendList = [];
				let recommendItem = {};

				recommendItem = {
					title: "出版精品",
					recommend: result.data.data
				};
				recommendList.push(recommendItem);

				//获取书籍推荐：男生热门
				homeApi.bookRecommend({
					id: "59128334694d1cda365b8985"
				}).then(result => {
					recommendItem = {
						title: "男生热门",
						recommend: result.data.data
					};
					recommendList.push(recommendItem);


					//获取书籍推荐：男生热门
					homeApi.bookRecommend({
						id: "5912825ba1dbf3ad33ee7ffe"
					}).then(result => {
						Toast.hide();

						recommendItem = {
							title: "女生最爱",
							recommend: result.data.data
						};
						recommendList.push(recommendItem);

						this.setState({
							recommendList: recommendList
						})
						common.cacheSet("cachRecommendList", recommendList);
					})
				})
			})
		}
	}

	componentWillUnmount(){
		this.props.userInfoActions.update({
			prevRouteUrl: 'home'
		})

	}

	render(){
		return(
			<div className="container">
				<HomeNav></HomeNav>
				<WingBlank>
					<ImgCarousel data={this.state.carouselImages}></ImgCarousel>
		         	<HomeNavigate data={this.state.homeNavigates} userinfo={this.props.userinfo}></HomeNavigate>
		         	<RecommendItem recommendList={this.state.recommendList}></RecommendItem>
		      	</WingBlank>
	      	</div>
		)
	}
}

function mapStateToProps(state){
	return {
		userinfo: state.userinfo
	}
}

function mapDispatchToProps(dispatch){
	return {
		userInfoActions: bindActionCreators(userInfoActions, dispatch)
	}
}

export default connect(
	mapStateToProps,
	mapDispatchToProps
)(Home);